<template>
	<view>
		<view class="address_edit">
			<view class="divContent">
				<view class="divItem">
					<text style="font-weight: bold;">联系人：</text>
					<view class="inputUser">
						<u-input fontSize="28rpx" border="none" maxlength='10' placeholder="请填写收货人的姓名" v-model="form.consignee"></u-input>
					</view>
					<text class="spanChecked" @click="form.gender = '0'">
						<text :class="{iActive:form.gender === '0'}"></text>
						先生
					</text>
					<text class="spanChecked" @click="form.gender = '1'">
						<text :class="{iActive:form.gender === '1'}"></text>
						女士
					</text>
				</view>
				<view class="divItem">
					<text style="font-weight: bold;">手机号：</text>
					<u-input fontSize="28rpx" border="none" maxlength='11' placeholder="请填写收货人手机号码" v-model="form.phone"></u-input>
				</view>
				<view class="divItem">
					<text style="font-weight: bold;">收货地址：</text>
					<u-input fontSize="28rpx" border="none" maxlength='140' placeholder="请输入收货地址" v-model="form.detail"></u-input>
				</view>
				<view class="divItem">
					<text style="font-weight: bold;">标签：</text>
					<text v-for="(item,index) in labelList" :key="index" @click="form.label = item;activeIndex = index"
						:class="{spanItem:true,spanActiveSchool:activeIndex === index}">{{item}}</text>
				</view>
				<view class="divSave" @click="saveAddress">保存地址</view>
				<view class="divDelete" @click="deleteAddress" v-if="id">删除地址</view>
			</view>
		</view>
	</view>
</template>

<script>
	import regeneratorRuntime, {
		async
	} from '../../../lib/runtime/runtime';
	import {addressFindOneApi,updateAddressApi,addAddressApi,deleteAddressApi} from '../../../api/address.js'
	export default {
		data() {
			return {
				title: '新增收货地址',
				form: {
					consignee: '', //联系人
					phone: '', //手机号
					gender: '1', //0表示男 1 表示女
					detail: '', //收货地址
					label: '公司', //标签
				},
				labelList: [
					'无', '公司', '家', '学校'
				],
				id: undefined,
				activeIndex: 0
			};
		},
		
		computed: {},
		onLoad(options) {
			if (options.id) {
				this.id = options.id
				this.initData()
			}
		},
		mounted() {},
		methods: {
			async initData() {
				if (this.id) {
					this.title = '编辑收货地址'
					const res = await addressFindOneApi(this.id)
					if (res.code === 0) {
						this.form = res.data
						// 设置标签的激活状态
						const labelIndex = this.labelList.indexOf(this.form.label)
						if (labelIndex !== -1) {
							this.activeIndex = labelIndex
						}
					} else {
						uni.showToast({
							title: res.msg,
							icon: 'none'
						})
					}
				}
			},
			async saveAddress() {
				const form = this.form
				if (!form.consignee) {
					return uni.showToast({
						title: '请输入联系人',
						icon: 'none'
					})
				}
				if (!form.phone) {
					return uni.showToast({
						title: '请输入手机号',
						icon: 'none'
					})
				}
				if (!form.detail) {
					return uni.showToast({
						title: '请输入收货地址',
						icon: 'none'
					})
				}
				const reg = /^1[3|4|5|7|8][0-9]{9}$/
				if (!reg.test(form.phone)) {
					return uni.showToast({
						title: '手机号不合法',
						icon: 'none'
					})
				}
				
				uni.showLoading({
					title: '保存中...'
				})
				
				let res = {}
				if (this.id) {
					res = await updateAddressApi(this.form)
				} else {
					res = await addAddressApi(this.form)
				}

				uni.hideLoading()
				
				if (res.code === 0) {
					uni.showToast({
						title: '保存成功',
						icon: 'success'
					})
					setTimeout(() => {
						uni.navigateBack({
							delta: 1
						})
					}, 1500)
				} else {
					uni.showToast({
						title: res.msg,
						icon: 'none'
					})
				}
			},
			deleteAddress() {
				uni.showModal({
					title: '确认删除',
					content: '确认要删除当前地址吗？',
					success: async (res) => {
						if (res.confirm) {
							uni.showLoading({
								title: '删除中...'
							})
							
							const result = await deleteAddressApi({
								id: this.id
							})
							
							uni.hideLoading()
							
							if (result.code === 0) {
								uni.showToast({
									title: '删除成功',
									icon: 'success'
								})
								setTimeout(() => {
									uni.navigateBack({
										delta: 1
									})
								}, 1500)
							} else {
								uni.showToast({
									title: result.msg,
									icon: 'none'
								})
							}
						}
					}
				})
			},
		}
	}
</script>

<style>
@import url(./addressEdit.css);
</style>
